<template>
  <div>
    <div class="flex flex-row justify-center">
      <x-upload @on-upload-complete="fetchJarList"/>
    </div>
    <el-empty v-if="jarList.length === 0" description="暂时没有项目嗷"/>
    <el-card v-else class="m-2" v-for="{file, fileSize, name, pid} in jarList">
      <x-jar @on-status-changed="fetchJarList" :file="file" :fileSize="fileSize" :name="name" :pid="pid"/>
    </el-card>
  </div>
</template>

<script setup>
import {listAll} from "@/api/api.js";
import {ref} from "vue";
import XUpload from "@/components/x-upload.vue";
import XJar from "@/components/x-jar.vue";

const jarList = ref([]);

const fetchJarList = () => {
  listAll().then(data => {
    console.log('查询所有 jar', data)
    // noinspection JSValidateTypes
    jarList.value = data;
  });
}

fetchJarList()
</script>